//文章详情页
import React from 'react'
import './Detail.css'
import { Input , Button} from 'element-react'
import { NavLink } from 'react-router-dom';
import { ActivityIndicator } from 'antd-mobile'
// import 'element-theme-default'

class Detail extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            buttype:'primary',
            buttxt:'+关注',
            userList:[],
            detUser:'',
            isShow: true
        }
    }
    componentDidMount(){
        let url = 'http://62.234.30.197:8088/userlist/cha';
        fetch(url, {
        method: 'POST',
        body: JSON.stringify({userid:this.props.location.state.item.userid}),
        headers: {
            "Access-Control-Allow-Origin":"*",
            'content-type': 'application/json'
        },
        mode: 'cors'
        })
        .then(res => res.json())
        .then(res => {this.setState({
            detUser:res[0],
            isShow: false
        })
<<<<<<< HEAD
        // //console.log(this.state.detUser)
=======
        // console.log(this.state.detUser)
>>>>>>> 429ee6d905019f594144cf938b04d544385572a3
    })
    }
    render() {
        //console.log(this.props.location.state.item);
        let item = this.props.location.state.item;
        return (
            <div className="body_div">
                <ActivityIndicator 
                    toast
                    text="加载中..."
                    animating={this.state.isShow}
                />
                <button onClick={() => this.props.history.goBack()} className="top_button">&lt;</button>
                <p>
                    文章详情
                </p>
                <NavLink to={{pathname:'/Personal', state: {item:this.state.detUser}}}>
                <div className='det_head' >
                    <div className='det_headpic'><img src={this.state.detUser.pic}></img></div>
                    <div className='det_headid'><p>{this.state.detUser.name}</p></div>
                    <div className='det_headtime'><p>{item.deliverdate}</p></div>
                    <Button type={this.state.buttype} style={{
                                        }} onClick={()=>{
                                        this.setState({
                                            buttype: 'text',
                                            buttxt:'已关注'
                                        })
                                        //console.log(this)
                                    }}>{this.state.buttxt}</Button>
                </div>
                </NavLink>
                <div className='self'>
                    <span>{item.title}</span>
                    <div className='det_pic'><img src={item.pic} alt='pic'/></div>
                    <div className='det_content'><p>{item.content}</p></div>
                </div>

                <div className="bottom__div">
                    <Input placeholder="写一句评论..." style={{
                        width: '60%',
                        float: 'left',
                        marginTop: '8px',
                        marginLeft: '5px'
                    }}/>
                </div>
            </div>
        )
    }
}

export default Detail



